<template>
  <f7-page>
    <f7-navbar title="营业统计" back-link="Back"></f7-navbar>
    <f7-list class="search-list searchbar-found" media-list>
      <f7-list-input
        label="开始时间"
        type="date"
        placeholder="Please choose..."
        :value="Checkintime"
        @input="Checkintime = $event.target.value"
      ></f7-list-input>
      <f7-list-input
        label="结束席间"
        type="date"
        placeholder="Please choose..."
        :value="departuretime"
        @input="departuretime = $event.target.value"
      ></f7-list-input>
      <f7-list-input label="营业额" type="text" clear-button disabled v-model="object.price"></f7-list-input>
      <f7-list-input label="订单数" type="text" clear-button disabled v-model="object.dingdansize"></f7-list-input>
      <f7-list-input label="人次" type="text" clear-button disabled v-model="object.totalCount"></f7-list-input>
    </f7-list>
    <!-- <div class="small">
      <chartjs :chart-data="datacollection"></chartjs>
    </div>-->
    <f7-button fill raised @click="fillData()">查询统计</f7-button>
  </f7-page>
</template>
<script>
import chartjs from "@/js/chartjs.js";
import axios from "axios";
import qs from "qs";
export default {
  components: {
    chartjs
  },
  data() {
    return {
      datacollection: null,
      object: [],
      Checkintime: "",
      departuretime: ""
    };
  },
  mounted() {},
  methods: {
    fillData() {
      // this.datacollection = {
      //   labels: [this.getRandomInt(), this.getRandomInt()],
      //   datasets: [
      //     {
      //       label: "Data One",
      //       backgroundColor: "#f87979",
      //       data: [this.getRandomInt(), this.getRandomInt()]
      //     },
      //     {
      //       label: "Data One",
      //       backgroundColor: "#f87979",
      //       data: [this.getRandomInt(), this.getRandomInt()]
      //     }
      //   ]
      // };
     
      URL = "/caofuying/statistical/selectStatistical";
      axios
        .get(URL, {
          params: {
            Checkintime: this.Checkintime,
            departuretime: this.departuretime
          }
        })
        .then(r => {
        const { data } = r;
        if (data != null) {
          this.object = data;
        } else {
          app.dialog.alert("服务器错误");
        }
      });
         
    }
    
    // getRandomInt() {
    //   return Math.floor(Math.random() * (50 - 5 + 1)) + 5;
    // }
  }
};
</script>